<template>
	<!-- <view class="list_box" :style="style_item">
		<view @click="navTo(item)" v-for="(item,index) in list" :key="index" class="list_box_item">
			<u-image  mode="aspectFit" border-radius="8" :fade="true" duration="450" width="100rpx" height="100rpx" :src="geshi(item.pic)" :lazy-load="true"></u-image>
			<view class="item_title">
				{{item.name}}
			</view>
		</view>
	</view> -->
	<view class="">
		<view class="list_title">
			<span class="list_title1">热门专区</span>
			<span class="list_title2">好货推荐</span>
		</view>
		<view class="list_box" :style="style_item">

			<view @click="navTo(item)" v-for="(item,index) in list" :key="index" class="list_box_item">
				<view class="list_box_img">
					<image :src="geshi(item.pic)" class="list_box_img" mode="heightFix"></image>
				</view>
				<view class="item_title">
					<view class="item_title1">
						<span>{{item.name}}</span>
						<view class="go_to">GO
							<u-icon name="arrow-right" color="#FAE0B9" size="18"></u-icon>
						</view>
					</view>
					<span class="item_title2">{{item.remark?item.remark:'暂无描述'}}</span>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
	import mImg from '@/componts/m-img/index.vue';
	export default {
		components: {
			mImg
		},
		props: {
			// 缺省图
			list: {
				type: Array,
				default: []
			},
			style_item: {
				type: Object,
				default: () => ({})
			},
		},
		data() {
			return {
				search_text: '',
				geshi: (pic) => {
					return pic.replace(/\\/g, '/')
				}
			}
		},
		methods: {
			navTo(item) {
				uni.navigateTo({
					url: `/pages/classification/goodsList?title=${item.name}&goods_group_id=${item.id}`,
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(./listGroup.css);
</style>